<template>
	<view>
		<view class="list-top" v-for="(item,index) in list" :key="item.epPrjId">
			<view class="list-head">
				<view class="construcTion">
					<view class="">
						<image src="http://106.14.56.171:15016/images/u425.png" />
					</view>
					<view class="aaaa">
						<text class="chuanHao">{{item.epPrjName}}<text
								class="chuanHao">{{' '}}{{item.shipType}}</text></text>
					</view>
				</view>
				<view class="essentialInformation">
					<view>
						<text class="Information">项目号</text>
						<text class="essential">{{item.epPrjCode ||''}}</text>
					</view>
					<view>
						<text class="Information">业主方</text>
						<text class="essential">{{item.ownersName ||''}}</text>
					</view>
					<view>
						<text class="Information">委托方</text>
						<text class="essential">{{item.companyBuyer ||''}}</text>
					</view>
					<view>
						<text class="Information">服务方</text>
						<text
							class="essential">{{item.companySeller != undefined || item.companySeller != null ?item.companySeller:''}}</text>
					</view>
					<view>
						<text class="Information">施工地址</text>
						<text class="essential">{{item.shipAddress ||''}}</text>
						<!-- <text class="essential">{{item.shipAddress &&item.shipAddress.toUpperCase()}}</text> -->
					</view>
				</view>
			</view>
			<view class="list_left" @click="clickParticulars(el)" v-for="(el,i) in item.eppEpProjectPlans" :key="i">
				<view class="listImage">
					<image v-if="el.status==0" src="/static/not.png" />
					<image v-if="el.status==1" src="/static/u2275.png" />
					<image v-if="el.status==2" src="/static/u2316.png" />
					<image v-if="el.status==3" src="/static/u2316.png" />
					<image v-if="el.status==4" src="/static/not.png" />
					<image v-if="el.status==5" src="/static/u2361.png" />
					<image v-if="el.status==6" src="/static/u2413.png" />
				</view>
				<view class="list-text1">
					<view class="list-text">
						<text class="text">派工单号</text>
						<text>{{el.planCode ||''}}</text>
					</view>
					<view class="list-text">
						<text class="text">设备名称</text>
						<text>{{el.eppEpEpoxyProjectPlanFacilityData.facilityName ||''}}</text>
					</view>
					<view class="list-text">
						<text class="text">
							预计交付
						</text>
						<text>
							{{el.endTime?el.endTime.slice(0,10):'-'}}
						</text>
					</view>
					<view class="list-text">
						<text class="text">工单状态</text>
						<text v-if="el.status==0">待施工</text>
						<text v-if="el.status==1">施工中</text>
						<text v-if="el.status==2">浇筑完成</text>
						<text v-if="el.status==3">预约报验</text>
						<text v-if="el.status==4">待签字</text>
						<text v-if="el.status==5">报验完成</text>
						<text v-if="el.status==6">暂停</text>
					</view>
				</view>
				<!-- 箭头 -->
				<view class="list-right">
					<image src="http://106.14.56.171:15016/images/u3063.png"/>
				</view>
			</view>

		</view>
	</view>
	</view>
</template>

<script>
	import {
		timeSplice
	} from '@/config/CurrentRouter.js'
	export default {
		components: {

		},
		data() {
			return {
				list: [],
				id: '',
				statusList: {}
			}
		},
		onLoad(option) {
			this.id = option.id
			this.getDispatching()
		},
		methods: {
			getDispatching() {
				this.$http.get('api/EpoxyProject/GetEpoxyProjectInfo', {
					epPrjId: this.id
				}).then(res => {
					this.list.push(res)
					this.statusList = res
				})
			},
			clickParticulars(el) {
				// console.log('el', el.status);
				const {
					planId,
					epPrjId,
					status
				} = el
				uni.navigateTo({
					url: `/pages/epoxyfile/epoxydateil?epPrjId=${epPrjId}&planId=${planId}`
				})
			},
			// 点击甘特图
			clickChart() {
				uni.navigateTo({
					url: `/pages/epoxyfile/gantchart?code=${this.statusList.epPrjId}&name=${this.statusList.epPrjCode}&type=1`
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.aaaa {
		width: 70%;
		// background-color: aqua;
		table-layout: fixed;
		word-wrap: break-all;
		word-break: normal;
		overflow: hidden;

		.chuanHao {
			font-weight: 600;
			font-size: 15px;
		}

	}

	.list-top {
		width: 96%;
		border-radius: 24rpx;
		background-color: #FFFFFF;
		/* background-color: aqua; */
		margin-left: 2%;
		margin-top: 20rpx;
		padding: 9px 0 0 0;
	}

	.list-head {
		padding: 10rpx 0;
	}

	.construcTion {
		display: flex;
		// justify-content: space-between;
		// align-items: center;
		padding: 0 0 10rpx 0;
		// background-color: aqua;
	}

	.list-head image {
		float: left;
		margin-top: 5rpx;
		margin-right: 15rpx;
		margin-left: 10rpx;
		width: 26rpx;
		height: 26rpx;
	}



	.ePumping {
		margin-left: 50rpx;
		margin-top: 10rpx;
		margin-bottom: 14rpx;
	}

	.list-right {
		width: 5%;
	}

	.list-right image {
		margin-left: 15rpx;
		width: 10rpx;
		height: 20rpx;
	}

	.list_left {
		border-top: 1px solid #eee;
		display: flex;
		padding: 10rpx;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
	}

	.list_left .listImage {
		width: 24%;
		height: 190rpx;
		margin-left: 5rpx;
		text-align: center;
		line-height: 120px;
	}

	.list_left .listImage image {
		width: 70rpx;
		height: 70rpx;
		margin-left: 5rpx;
		display: inline-block;
	}

	.list-text1 {
		width: 80%;
	}

	.text {
		margin-right: 18rpx;
	}

	.list-text .text {
		width: 23%;
		display: inline-block;
		text-align: right;
		color: #666;
	}

	text {
		font-size: 13px;
	}

	.essentialInformation {
		border-top: 1px solid #eee;
		padding: 15rpx 0 0 55rpx;

		view .Information {
			width: 18%;
			display: inline-block;
			text-align: left;
			color: #666;
			margin-right: 10rpx;
		}

	}

	.essential {
		display: inline-block;
		width: 70% !important;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		line-height: 100%;
		margin-bottom: -5rpx;
	}
</style>
